const React = require('react');
const ReactDOM = require('react-dom');
const Component = React.Component;
const Tile = require("./Tile");
const Grid = require("Grid");
const FontIcon = require("FontIcon");


class Page extends Component{
    componentDidMount (){
        for(let i in this.refs){
            let ref = this.refs[i];
            let block = ReactDOM.findDOMNode(ref);
            SyntaxHighlighter.highlight({}, block);
        }
    }

    render() {
        let data = [];
        for(let i = 0; i < 50; i++){
            data.push({
                id: "item_"+i,
                field1: i,
                field2: i,
                field3: "field3_"+i,
                field4: "field4_"+i,
                field5: "field5_"+i,
            });
        }
        return (
            <div className="container">

                <Grid fixed={true} columns={[
                    {name:"field1", text: "#"},
                    {name:"field2", text: "field2", sort: true, resize: true},
                    {name:"field3", text: "field3", sort: true, sortType: "local"},
                    {name:"field4", text: "field4"},
                    {name:"field5", text: "field5"}
                ]} data={data} ></Grid>
            </div>
        )
    }
}

module.exports = Page;